﻿@using LKVMLMADMIN.Models;
@using PagedList.Mvc;
@using System.Globalization;
@using LKVMLMLib;
@{
    Layout = "~/Views/Shared/_LayoutAdmin.cshtml";
    var listUserPhongCho = ViewBag.listUserPhongCho;
    var listReviewRoom2 = ViewBag.listReviewRoom2;
}
<style>
    .choNhanChil:hover {
        cursor: move;
    }

    .phongTitle {
        width: 100%;
        height: 40px;
        text-align: center;
        font-size: 16px;
        border-bottom: thin solid #ccc;
        line-height: 2.5;
        color: #337ab7;
        background: #eee;
    }

    .choNhanChil {
        line-height: 30px;
        width: 200px;
        border: 1px solid rgb(204, 204, 204);
        margin: 15px 0px;
        box-shadow: rgb(204, 204, 204) 2px 2px 2px;
        text-align: center;
    }

    .left_user {
        width: 30%;
        float: left;
        border: thin solid #ccc;
        box-shadow: 5px 5px 5px #ccc;
    }

    .right_user {
        width: 30%;
        border: thin solid #ccc;
        float: right;
        box-shadow: 5px 5px 5px #ccc;
    }
</style>
@using (Html.BeginForm("Index", "GianTiepChau", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-inline" }))
{
    <div id="wrapper">
        <div class="row">
            <h3 class="page-header">Phòng nhận</h3>
        </div>
        <!-- /.row -->
        <div class="row">
            <div class="col-lg-12">
                <div class="panel-body">
                    <div class="dataTable_wrapper">
                        <div id="left_user_Nhan" class="left_user">
                            <div class="phongTitle">Phòng chờ</div>
                            <ul class="connectedSortable ui-sortable" style="list-style:none;min-height:300px;float:left;margin-right:10px;">
                               
                                    @foreach (var item in listUserPhongCho)
                                    {
                                        <li class="choNhanChil" title="@item.Id">@item.UserName</li> @*accesskey="@item.RoomCode"*@
                                    }

                                

                            </ul>
                        </div>
                        <div style="width:40%;height:200px;float:left">
                            <div style="margin:auto;height:50px;margin-top:30%;margin-left:40%"><a href="javascript:void(0)" onclick="submitForm()" class="btn_submit btn btn-default">Submit</a></div>
                        </div>
                        <div id="right_user_Nhan" class="right_user">
                            <div class="phongTitle">Phòng nhận</div>
                            <ul class="connectedSortable ui-sortable" style="list-style:none;min-height:300px;float:left;">
                                
                            </ul>
                            <input hidden="hidden" value="@ViewBag.roomCode" id="roomCode" /> 
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div class="dataTable_wrapper">
                    <div id="showReviveRoom" style="margin:auto">
                        @if (listReviewRoom2!=null)
                        {
                            <table class="table table-striped table-bordered table-hover">
                                <thead>
                                    <tr>
                                        <th>STT</th>
                                        <th>UserId</th>
                                        <th>RoomCode</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @{int j = 0;}
                                    @foreach (var temp in listReviewRoom2 as List<RoomCodeModel>)
                                    {
                                        j++;
                                        <tr>
                                            <td>@j</td>
                                            <td>@temp.UserName</td>
                                            <td>@temp.RoomCode</td>
                                        </tr>
                                    }
                                </tbody>
                            </table>
                        }
                    </div>
                </div>
            </div>
        </div>
    </div>
}
<script type="text/javascript">
    $(function () {
        $("#left_user_Nhan ul, #right_user_Nhan ul").sortable({
            connectWith: ".connectedSortable",
            placeholder: "ui-state-highlight"
        }).disableSelection();
        $("#idsubmit").click(function () {
            var msg = $("#table1 > tbody");
            var list = $("#left_user_Nhan ul li");
            $(msg).html("");
            $(list).each(function (index) {
                $(msg).append("<tr><td>" + index + "</td><td> " + $(this).closest("li").prop("id") + "</td><td> " + $(this).text() + "</td></tr>");
            });
        });
    });
    function submitForm() {
        var list = $("#right_user_Nhan ul li");
        var chuoi = "";
        var roomCode = document.getElementById('roomCode').value;
        $(list).each(function (index) {
            chuoi = chuoi + $(this).closest("li").prop("title") + ",";
        });
        $.ajax({
            url: '/ChoNhan/AddReviveRoom?chuoi=' + chuoi,
            dataType: "json",
            success: function (data) {
                if (data.Status) {
                    setTimeout(location.reload(true), 3000);
                }
            }
        });
    }
</script>